<template>
	<div class="t10">
		<div style="width: 70%;margin: auto;">
			<h2 style="text-align: center;">{{infos.title}}</h2>
			<p style="border-bottom: 1px #e5e5e5 solid;color: #a2a2a2;">
				<span style="display: inline-block;height: 35px;">{{infos.updateDate}}</span>
				<span style="margin-left: 2em;">{{infos.createName}}</span>
			</p>
			<p style="line-height: 30px;font-size: 16px;padding-bottom:20px;" v-html="infos.contentAll"></p>
		</div>
		<div id="cb">
			<button @click="backHistory()">返回</button>
		</div>
	</div>
</template>

<script>
	import {
		request
	} from "../util/request.js"

	export default {
		data() {
			return {
				infos: {
					title: '',
					content: ''
				}
			}
		},
		methods: {
			backHistory() {
				this.$router.go(-1); //返回上一层
			},
      // 阅读埋点
      readPointFn () {
        request({
          method: 'get',
          url: 'articleInfo/read',
          params: {
            id: this.infos.id,
          }
        }).then(res => {

        })
      },
		},
		created() {
			this.infos = this.$route.params.info
			this.infos = JSON.parse(localStorage.getItem('infos'))
      this.readPointFn()
		}
	}
</script>

<style>
	.t10 {
		font-size: 15px;
	}
	#cb{
		position: fixed;
		right: 30px;
		top: 50%;
    margin-top: -25px;
	}
	#cb button{
		color: white;
		width:50px;
		height:50px;
		border-radius: 50%;
		font-size: 15px;
		font-weight:initial;
		padding: 0;
		text-align: center;
		background-color: orange;
		border: 0;
    cursor: pointer;
	}
	.t10 table{
		border-collapse: separate;
	}
	.t10 table tr td{
		border: 1px solid grey;
		padding: 3px 5px;
	}
	.t10 table th{
		background-color: #F5F2F0;
		border: 1px solid grey;
		padding: 3px 5px;
	}
</style>
